 <base href="${CONTEXT_PATH}/" />
<link rel="stylesheet" type="text/css" href="assets/plugins/bootstrap-3.3.5/css/bootstrap.css">
<link rel="stylesheet" type="text/css" href="assets/css/index.css">
<link rel="stylesheet" type="text/css" href="assets/icon/iconfont.css">
<link rel="stylesheet" type="text/css" href="htwj/css.css">



	<div class="main_fr_search over mb10 hide">
		  <form id="search_submit" class="form-inline">
			  <div class="good_top22">
				  <span class="good_top021">条件查询</span>
				  <!-- <span class="good_top022">
				      <input type="button" onclick="search(1);" class="search_an01 anbg" value="查询">
		              <input type="reset" class="search_an01" value="取消">
				   </span> -->
			  </div>
			  <div class="main_fr_search_cx">
			  	<input type="hidden" id="lesson_id" name="attachment.lesson_id" value="${lessonid!}">
				课时名称<input  placeholder="请输入课时名称" type="text" class="srk" style="width:200px;"/>
			  	状态<select  class="srk" style="width:200px;">
	              		<option value="">请选择状态</option>
	              		<option value="0">待提交</option>
	              		<option value="1">待审核</option>
	              		<option value="2">已通过</option>
	              		<option value="3">未通过</option>
	              	</select>
	              	<input type="button" onclick="search(1);" class="search_an01 anbg" value="查询">
			  </div>
		  </form>
	</div>


	<div class="sh_search over mb10">
		<div class="over sh_search_table">
			
	<div class="over mb10" style=" position:relative; ">
		<div class="good_top22" style="margin-bottom: 0px;">
		  <span class="good_top021">附件列表</span>
		  <span class="good_top022">
		     <input type="button" onclick="update(0);" class="search_an01" value="新增">
		   </span>
		 </div>
	</div> 
	</div>
	<table class="table table-bordered table-hover">
		<thead  class="table_heaer">
			<tr class="text-center">
			<th>编号</th>
				<th>附件名称</th>
				<th>附件描述</th>
				<th>允许下载</th> 
			<!-- 	<th>状态</th> -->
				<th>操作</th>
			</tr>
		</thead>
		<tbody id="projectTable">
		</tbody>
	</table>
	</div>
		<div id="pages" class="text-right"></div>	
	</div>
	
</div>



<div id="addFormDiv" class="hide" style="padding-top:15px;">
	<form class="form-horizontal" id="addForm">
		<input type="hidden" id="lesson_id" name="attachment.lesson_id" value="${lessonid!}">
		<input type="hidden" id="id" name="attachment.id" >

		<div class="form-group">
			<label for="exampleInputEmail2" class="col-sm-2 control-label">附件描述</label>
			<div class="col-sm-9">
				<textarea rows="5" class="col-sm-12" id="des" placeholder="附件描述" name="attachment.des" minlength="2"  maxlength="500" required></textarea>
			</div>
		</div>
	    <div class="form-group" id="videoContent">
			<label for="exampleInputEmail2" class="col-sm-2 control-label" >附件上传</label>
			<div class="col-sm-9">			
			 
     			
     			 <input type="file"  name="fileToUpload" id="fileToUpload" onchange="fileSelected();" style="display:none" />
			<div class="input-append" > 
	       <input id="photoCover" class="input-large" type="text" style="height:30px;display:none"> 
	       
	           

				</div>
				
				<div id="fileFrame"></div>
    			<button  type="button" id="shangchuan" class="btn btn-success">上传</button>
    			<span id="yangshi"><a class="btn " onclick="$('input[id=fileToUpload]').click();">选择</a> </span>
   				 <button  id="zanting"  type="button" class="btn btn-default">暂停</button>
   				 &nbsp;<label id="progressNumber"></label>
				<div id="bofang" class="hide">

				</div>
				<br/>
		
				
				<input type="hidden"  name="attachment.path" id="src" value="-1"/>
				<input type="hidden"  name="attachment.type"  value="0"/>
				<input type="hidden"  name="attachment.title" id="src2" value="-1"/>
				</div>

			</div>
	


		<div class="form-group">
			<label for="exampleInputEmail2" class="col-sm-2 control-label">是否允许下载</label>
			<div class="col-sm-9">
			<select id="download" name="attachment.download" class="form-control" style="width:200px;">
					<option value="1" selected="selected">允许</option>
					<option value="0" >禁止</option>
			</select>
			</div>
		</div>
		<div class="form-group">
		<label for="exampleInputEmail2" class="col-sm-2 control-label"></label>
			<div class="col-sm-9">
			<button type="button" id="tijiao" class="btn btn-success">提交</button>
			<button type="reset" class="btn btn-default">重置</button>
			</div>
		</div>
		
	</form>
</div>


<script type="text/javascript" src="assets/js/jquery1_12.min.js"></script>
<script type="text/javascript" src="assets/plugins/layer-v2.2/layer/layer.js"></script>
<script type="text/javascript" src="assets/plugins/layer-v2.2/layer/extend/layer.ext.js"></script>
<script type="text/javascript" src="assets/plugins/laypage-v1.3/laypage/laypage.js"></script>
<script type="text/javascript" src="assets/plugins/jquery-validation-1.14.0/dist/jquery.validate.min.js"></script>
<script type="text/javascript" src="assets/plugins/jquery-validation-1.14.0/dist/localization/messages_zh.js"></script>
<script type="text/javascript" src="assets/js/jquery.media.js"></script>


<script>
$(function() {   
    $("a.media").media({width:800, height:600});  
});  
function userList(data) {
	var dataStr = "";
	$.each(data, function(i, v) {
		if(v.description==null){
			v.description=="";
		}
		dataStr += '<tr>';
		dataStr += '<td>' + v.id + '</td>';
		dataStr += '<td>' + v.title + '</td>';
		dataStr += '<td>' + v.des + '</td>';
		if(v.download==0){
			dataStr += '<td>禁止</td>';
		}else if(v.download==1) {
			dataStr += '<td>允许</td>';
		} 
	/* 	if(v.status==0){
			dataStr += '<td>待审核</td>';
		}else if(v.status==1) {
			dataStr += '<td>通过</td>';
		} else if(v.status==2) {
			dataStr += '<td>未通过</td>';
		} */
		dataStr += '<td><a href="javaScript:update(' + v.id + ');" class="btn btn-default">' + '编辑' +'<a Id="' + v.id + '" class="btn btn-default downloadButton" href="lesson/download?id='+v.id+'">' + '下载' + '</a>' +'<a Id="' + v.id + '" class="btn btn-default deleteButton">' + '删除' + '</a>';
		if(v.title.split(".")[1]=="pdf"||v.title.split(".")[1]=="txt"){
			dataStr+='<a Id="' + v.id + '" href="'+v.path+'"  target="_Blank" class="btn btn-default yulanButton media">' + '预览' + '</a></td>';
		}else{
			dataStr+='</td>';
		}
		dataStr += '</tr>';
	});
	$("#projectTable").html(dataStr);
	$("#projectTable .deleteButton").click(function() {
		clickDelete($(this));
		return false;
	});
	
	/* $("#projectTable .yulanButton").click(function() {
	layer.msg("开发中");
	
	}); */
	

	
}
var cc2=1;
function pageChange(curr) {
	$.get("lesson/fujianList?curr="+curr, $("#search_submit").serialize(), function(data) {
		userList(data.content.list);
		laypage({
		    cont: $('#pages'), 
		    pages: data.content.totalPage, 
		    skip: true, 
		    skin: '#4599e0',
		    curr: data.content.pageNumber,
		    groups: 3, 
		    jump: function(obj, first) {
		    	if(!first){ 
		    		cc2=obj.curr;
		    		pageChange(obj.curr);
		    	}
		    }
		});
	});
}
pageChange(1);
function search(curr){
	if(curr != 1){
		curr=cc2;
	}
	pageChange(curr);
}
var index2;
var validator;
$().ready(function() {
	 validator = $("#addForm").validate({
	        submitHandler:function(form){
	        	
	        
	        	$.post('lesson/updateFujian', $("#addForm").serialize(), function(data){
	        		if(data.code==0){
	        			layer.msg("保存成功！");
	        			layer.close(index2);
	        			search(cc2);
	        		}else{
	        			layer.msg("保存失败！");
	        			return false;
	        		}
	        	}) 
	        }    
	    });
	    $("#reset").click(function() {
	        validator.resetForm();
	    });

	});
function update(id) {
	var tit = "新增附件信息";
	jQuery('#video_path').html("");
	if(id != 0){
		$.post("lesson/getFujianInfo",{id:id},function(data){
			if(data.code==0){
				for (var key in data.content){
					$("#"+key).val(data.content[key]);
			}
				$("#src").val(data.content.path)
				$("#src2").val(data.content.title)
				
				$("#fileToUpload").attr("class","hide");
			 	   var str="";
             	  
               	str=str+data.content.title
             
      				str=str+"<a id='shanchu' class='btn'>删除</a>"
               	   $("#bofang").html(str);
               	$("#bofang").removeClass("hide");
                $("#yangshi").attr("class","hide");
				
               	$("#shanchu").click(function(){
               		
               		
               		var file = $("#fileToUpload") ;
             	   file.after(file.clone().val(""));      
             	   file.remove();
               		
               		$("#fileFrame").empty();
               	 	$("#bofang").empty();
               	 	$("#bofang").attr("class","hide");
               	 	$("#shangchuan").attr("class","hide");
               	 	$("#zanting").attr("class","hide");
               	 	$("#fileToUpload").attr("class","");
               	 	$("#src").val("-1");
               	 $("#src2").val("-1");
               	 $("#yangshi").attr("class","");
               	$('#photoCover').val("");
               	});

               	
				
			}else{
				layer.msg("获取信息失败！");
				return false;
			}
		})
		tit = "修改附件信息";
	}else{
		document.getElementById("addForm").reset();
		$("#id").val("");
	} 
 	$("#addFormDiv").removeClass("hide");
 	
	
 	$("#fileFrame").empty();
 	$("#bofang").empty();
 	$("#bofang").attr("class","hide"); 
 	$("#shangchuan").attr("class","hide btn btn-success");
 	$("#zanting").attr("class","hide btn btn-success");
 	$("#fileToUpload").attr("class","");
 	$("#src").val("-1");
 	$("#src2").val("-1");
 	$('#photoCover').val("");
 	$("#yangshi").attr("class","");
	index2=layer.open({
		type : 1,
		area: ['65%','85%'],
		offset: '10%',
		shift: 5,
		title : tit,
		content : $("#addFormDiv"),
	
	})
};

function clickDelete(obj) {

	if(confirm("确定要删除附件吗？")){
		var id = obj.attr("id");
		$.get("lesson/delFujian", {"id":id}, function(data) {
			if (data.code == 0) {
				obj.closest("tr").remove();
				layer.msg("删除成功！");
			}else{
				layer.msg("删除失败！");
				return false;
			} 
		})
	}
}
</script>

<script type="text/javascript">

var paragraph = 1024*1024*2;  //每次分片传输文件的大小 2M
var blob = null;//  分片数据的载体Blob对象
var fileList = null; //传输的文件
var uploadState = 0;  // 0: 无上传/取消， 1： 上传中， 2： 暂停
 


 $("#shangchuan").click(function(){
	
	$("#shangchuan").addClass("hide");
	$("#yangshi").addClass("hide");
	//$("#zanting").removeClass("hide");
	  fileList = document.getElementById('fileToUpload');
     //将上传状态设置成1
    uploadState = 1;
    if(fileList.files.length>0){
    	$("#fileToUpload").addClass("hide");
    	
        for(var i = 0; i< fileList.files.length; i++){
            var file = fileList.files[i];
            uploadFileInit(file,i);
        }
    }else{
        layer.msg("请选择附件");
    } 
}); 

/**
 * 获取服务器文件大小，开始续传
 * @param file
 * @param i
 */
 
 

function uploadFileInit(file,i){
    if(file){
        var startSize = 0;
        var endSize = 0;
        var date = file.lastModifiedDate;
        var lastModifyTime = date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate()+"-"
        +date.getHours()+"-"+date.getMinutes()+"-"+date.getSeconds()
        //获取当前文件已经上传大小
         
        jQuery.post("uploadfile/getFileSize",{"fileName":encodeURIComponent(file.name),"fileSize":file.size,"lastModifyTime":lastModifyTime,"chunkedFileSize":"chunkedFileSize"},
                function(data){
                    if(data != -1){
                        endSize = Number(data);
                    }
                    uploadFile(file,startSize,endSize,i);
            
        });
         
    }
}
/**
 * 分片上传文件
 */
function uploadFile(file,startSize,endSize,i) {
        var date = file.lastModifiedDate;
        var lastModifyTime = date.getFullYear()+"-"+(date.getMonth()+1)+"-"+date.getDate()+"-"
        +date.getHours()+"-"+date.getMinutes()+"-"+date.getSeconds()
        var reader = new FileReader();
        reader.onload = function loaded(evt) {
            // 构造 xmlHttpRequest 对象，发送文件 Binary 数据
            var xhr = new XMLHttpRequest(); 
                xhr.sendAsBinary = function(text){
                    var data = new ArrayBuffer(text.length);
                    var ui8a = new Uint8Array(data, 0);
                    for (var i = 0; i < text.length; i++) ui8a[i] = (text.charCodeAt(i) & 0xff);
                    this.send(ui8a);
                }

            xhr.onreadystatechange = function(){
                if(xhr.readyState==4){
                    //表示服务器的相应代码是200；正确返回了数据   
                   if(xhr.status==200){ 
                       //纯文本数据的接受方法  
                    //   alert(xhr.responseText);
                       
                       var obj = JSON.parse(xhr.responseText);
                       var message=obj.currentFileLength; 
                    
                       message = Number(message);
                       
                       uploadProgress(file,startSize,message,i);
                       if(obj.code==0){
                    	   $("#src").val(obj.src);
                    	   $("#src2").val(obj.src2);
                    	   
                    	   var str="";
                    	  
                    	str=str+obj.src2+" 上传成功 "
                  
           				str=str+"<a id='shanchu2' class='btn'>删除</a>"
                    	   $("#bofang").html(str);
                    	$("#bofang").removeClass("hide");
                    	$("#fileFrame").empty();
                       }
                      
                       $("#shanchu2").click(function(){
                    		
                    	   var file = $("#fileToUpload") ;
                    	   file.after(file.clone().val(""));      
                    	   file.remove();  
                    	   $('#photoCover').val("");
                    	   $("#fileFrame").empty();
                    	 	$("#bofang").empty();
                    	 	$("#bofang").attr("class","hide");
                    	 	$("#shangchuan").attr("class","hide");
                    	 	$("#zanting").attr("class","hide");
                    	 	$("#fileToUpload").attr("class","");
                    	 	$("#src").val("-1");
                    	 	$("#src2").val("-1");
                    	 	$("#yangshi").attr("class","");
                    	});
                    } else{      
                        layer.msg("上传失败，服务器出现错误！");
                    }  
               }  
            };//创建回调方法encodeURIComponent(file.name)
          
            xhr.open("POST", "uploadfile/appendUpload?fileName="+encodeURIComponent(encodeURIComponent(file.name))+"&fileSize="+file.size+"&lastModifyTime="+lastModifyTime, false);
            
            xhr.overrideMimeType("application/octet-stream;charset=utf-8"); 
            xhr.sendAsBinary(evt.target.result); 
        };
        if(endSize < file.size){
            //处理文件发送（字节）
            startSize = endSize;
            if(paragraph > (file.size - endSize)){
                endSize = file.size;
            }else{
                endSize += paragraph ;
            }
            if (file.webkitSlice) {
              //webkit浏览器
                blob = file.webkitSlice(startSize, endSize);
            }else
                blob = file.slice(startSize, endSize);
            reader.readAsBinaryString(blob);
        }else{
            document.getElementById('progressNumber'+i).innerHTML = "上传进度: "+'100%';
        }
}
 
//显示处理进程
function uploadProgress(file,startSize,uploadLen,i) {
    var percentComplete = Math.round(uploadLen * 100 / file.size);
    document.getElementById('progressNumber'+i).innerHTML = "上传进度: "+percentComplete.toString() + '%';
    if(percentComplete==100){
    	$("#shangchuan").addClass("hide");
    	$("#zanting").addClass("hide");
    	$("#fileToUpload").addClass("hide");
    }
    //续传
    if(uploadState == 1){
        uploadFile(file,startSize,uploadLen,i);
    }
}
 
/*
暂停上传
*/

$("#zanting").click(function(){
	   
    uploadState = 2;
   
    $("#zanting").addClass("hide");
	$("#shangchuan").removeClass("hide");
});


/**
 * 选择文件之后触发事件
 */
function fileSelected() {

	$('#photoCover').val($("#fileToUpload").val()); 

    fileList = document.getElementById('fileToUpload');
    var length = fileList.files.length;
   
   if(length>0){
	   $("#shangchuan").attr("class","btn btn-success");
   }
    var frame = document.getElementById('fileFrame');
        for(var i=0; i<length; i++){
            file = fileList.files[i];
            if(file){
         
                var fileSize = 0;
                if (file.size > 1024 * 1024)
                    fileSize = (Math.round(file.size * 100 / (1024 * 1024)) / 100).toString() + 'MB';
                else
                    fileSize = (Math.round(file.size * 100 / 1024) / 100).toString() + 'KB';
                var nameDiv = document.createElement("div");
                    nameDiv.setAttribute("id","fileName"+i);
                    nameDiv.innerHTML='附件名称: ' + file.name;
                var sizeDiv = document.createElement("div");
                    sizeDiv.setAttribute("id","fileSize"+i);
                    sizeDiv.innerHTML='附件大小: ' + fileSize;
                var typeDiv = document.createElement("div");
                    typeDiv.setAttribute("id","progressNumber"+i);
                    typeDiv.innerHTML='<br>';
            }
            frame.innerHTML = "";
            frame.appendChild(nameDiv);
            frame.appendChild(sizeDiv);
            frame.appendChild(typeDiv); 
            
           
        }
}
</script>
<script>

$("#tijiao").click(function(){
	 fileList = document.getElementById('fileToUpload');
	
    if(fileList.files.length>0&&$("#photoCover").val()!=null){
     
      if($("#src").val()==-1){
    	  layer.msg("附件上传完成后才能提交");   	  
    	 
      }else{
    	  $("#addForm").submit(); 
      }
      
        	
       
    }else{
    if($("#bofang").text()==null){
    	layer.msg("请选择附件");
    }else{
    	 if($("#src").val()==-1){
    		 layer.msg("请选择附件");  	  
       	 
         }else{
        	 $("#addForm").submit(); 
         }
    	
    }
    		
    	
        
    }
});

</script>

<script>


</script>



